<!--
 * @Author: your name
 * @Date: 2020-02-25 13:32:39
 * @LastEditTime: 2020-02-28 11:25:55
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \福路德扫码系统\html\cksm.html
 -->
<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport"
        content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0,viewport-fit=cover" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>Hello APP</title>

    <link rel="stylesheet" type="text/css" href="../../css/vant.css">
    <link rel="stylesheet" type="text/css" href="../../css/base.css" />
    <link rel="stylesheet" type="text/css" href="../../css/local.css" />
    <link rel="stylesheet" type="text/css" href="../../font/iconfont.css" />
    <link rel="stylesheet" href="../../script/elementui/lib/theme-chalk/index.css?t=1">
    <link href="../../script/elementui/vue-element-table.css" rel="stylesheet" />
    <script type="text/javascript" src="../../script/jquery.js"></script>
    <script type="text/javascript" src="../../script/layer/layer.js"></script>
    <script type="text/javascript" src="../../script/vue.min.js"></script>
    <script type="text/javascript" src="../../script/vant.min.js"></script>
    <script type="text/javascript" src="../../script/fastclick.js"></script>
    <script src="../../script/elementui/lib/index.js?t=1"></script>
    <script src="../../script/elementui/vue-element-bigdata-table.min.js?t=4"></script>
    <script type="text/javascript" src="../../script/base.js"></script>
    <script type="text/javascript" src="../../script/JSLINQ.js"></script>
    <style type="text/css">
        .bottom {
            padding: 8px 15px;
        }

        .title {
            font-size: 17px;
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            word-break: break-all;
            padding-right: 10px;
        }

        .date {
            float: right;
            font-size: 12px;
            color: #cbcbcb;
        }

        .sub {
            white-space: nowrap;
            text-overflow: ellipsis;
            overflow: hidden;
            word-break: break-all;
            font-size: 14px;
            color: #a3a3a3;
        }

        .creater {
            font-size: 14px;
        }

        .result span {
            background: #fdf9f8;
            border: 1px solid #eeebec;
            border-radius: 10px;
            font-size: 12px;
            transform: scale(0.9);
            display: inline-block;
            height: 16px;
            line-height: 14px;
            padding: 0 2px;
        }

        .status-0 span {
            transform: scale(1);
            border: 0;
            background: #ffffff;
            color: #e3b474;
        }

        .status-1 span {
            color: #47ba9c;
        }

        .status-2 span {
            color: #dd7e70;
        }

        .bo {
            padding-top: 10px;
        }

        .sq {
            display: inline-block;
            font-size: 13px;
            padding: 0 2px;
            margin-right: 5px;
            min-width: 16px;
            height: 18px;
            line-height: 18px;
            border-radius: 4px;
            text-align: center;
            background-color: #3396fb;
            color: #ffffff;
        }

        .title span {
            vertical-align: middle;
        }

        .tab {
            height: 26px;
        }

        .tab>div {
            border-radius: 6px;
            overflow: hidden;
            border: 1px solid #3396fb;
            font-size: 0;
            height: 26px;
        }

        .tab .tab-row {
            display: inline-block;
            font-size: 13px;
            padding: 2px 5px;
            color: #3396fb;
            line-height: 22px;
        }

        .tab .tab-row.on {
            background: #3396fb;
            color: #ffffff;
        }

        .van-search {
            padding: 5px 0;
        }

        .title-read {
            color: #aaacac;
            font-size: 13px;

        }
    </style>
</head>

<body>
    <div id="app" v-cloak>
        <van-nav-bar-main :title="title" left-arrow @click-left="onClickLeft">
        </van-nav-bar-main>
        <!-- <van-nav-bar-main :title="title"  @click-left="onClickLeft">
         </van-nav-bar-main> -->

        <van-tabs v-model="active" @click="onClick">
            <van-tab :title="item.APFunName" :name='item.Para' v-for='item,index in roleList' :key='index'>
                <div class="box" style="user-select:none;">

                </div>
            </van-tab>
        </van-tabs>

        <div class="box" style="user-select:none;">

        </div>


    </div>
</body>
<script type="text/javascript">
    var vm;
    apiready = function () {
        var browser = api.require('webBrowser');
        vm = new Vue({
            el: '#app',
            data: {
                active: '',
                title: '',
                roleList: []
            },
            created: function () {
                var that = this
                console.log('api', JSON.stringify(api.pageParam))
                if (api.pageParam.title == '生产监控大屏_三车间') {
                    that.title = '生产监控大屏'
                    that.addList()
                    that.onClick(api.pageParam.url)
                    that.active = api.pageParam.url
                }
                else if (api.pageParam.title == '生产监控大屏_二车间') {
                    that.title = '生产监控大屏'
                    that.addList()
                    that.onClick(api.pageParam.url)
                    that.active = api.pageParam.url

                }
                else if (api.pageParam.title == '生产监控大屏_四车间') {
                    that.title = '生产监控大屏'
                    that.addList()
                    that.onClick(api.pageParam.url)
                    that.active = api.pageParam.url

                }
                else {
                    that.title = api.pageParam.title
                    browser.openView({
                        url: api.pageParam.url,
                        rect: {
                            x: 0,
                            y: 70
                        }
                    })
                }
            },
            methods: {

                onClick(name, title) {
                    browser.openView({
                        url: name,
                        rect: {
                            x: 0,
                            y: 150
                        }
                    })
                },
                onClickLeft() {
                    api.closeWin();
                },
                addList() {
                    var that = this
                    APP.ajax('getAppModuleByRoleIdtd', { RoleId: APP.getUserInfo().RoleId, APPType: 2 }, function (res) {
                        that.roleList = res.ds;
                    })
                }
            }
        })
    };
</script>

</html>